// components/echart.js
import * as echarts from '../../ec-canvas/echarts';
function setOption(chart, xdata, ydata) {
  const option = {  
  tooltip: {
      trigger: 'axis'
  },
  grid: {
      top:'8%',
      left: '3%',
      right: '4%',
      containLabel: true
  },

  xAxis: {
      type: 'category',
      boundaryGap: false,
      data: xdata
  },
  yAxis: {
      type: 'value',
      max : 2.0,
      min : 0,
      splitNumber : 10,
  },
  series: [
      {
          name: '右眼视力',
          type: 'line',
          color:'#eb6100', //改变折线点的颜色
          lineStyle:{ 
            color:'#eb6100' //改变折线颜色
          } ,
          data:ydata[0]
      },
      {
          name: '左眼视力',
          type: 'line',
          color:'#0000ff', //改变折线点的颜色
          lineStyle:{ 
            color:'#0000ff' //改变折线颜色
          } ,
          data:ydata[1]
      },
      {
          name: '双眼视力',
          type: 'line',
          color:'#fff100', //改变折线点的颜色
          lineStyle:{ 
            color:'#fff100' //改变折线颜色
          } ,
          data:ydata[2]
      }
  ]
  };
  chart.setOption(option)
}

Component({
  /**
   * 组件的属性列表
   */
  properties: {
      xAxis:{
        type:Array,
        default:[""]
      },
      yAxis:{
        type:Array,
        default:[[""]]
      },
  },

  /**
   * 组件的初始数据
   */
  data: {
    ecOne: {
      lazyLoad: true
  },
    
  },
  lifetimes: {
    // 组件的生命周期函数，用于声明组件的生命周期
    attached: function() {
      let x = this.data.xAxis;
      let y = this.data.yAxis;
    this.oneComponent = this.selectComponent('#mychart-one');  
    this.init_one(x,y)
    },
    moved: () => {},
    detached: () => {}
  },
  /**
   * 组件的方法列表
   */
  methods: {
    init_one: function (xdata, ydata) {           //初始化第一个图表
      this.oneComponent.init((canvas, width, height) => {
          const chart = echarts.init(canvas, null, {
              width: width,
              height: height
          });
          setOption(chart, xdata, ydata)
          this.chart = chart;
          return chart;
      });
  },
  }
})
